<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>我的笔记</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="x-pjax-version" content="v173">
        <link rel="apple-touch-icon-precomposed" sizes="144x144" href="ico/favico-144-precomposed.png">
        <link rel="apple-touch-icon-precomposed" sizes="114x114" href="ico/favico-114-precomposed.png">
        <link rel="apple-touch-icon-precomposed" sizes="72x72" href="ico/favico-72-precomposed.png">
        <link rel="apple-touch-icon-precomposed" href="ico/favico-57-precomposed.png">
        <link rel="shortcut icon" href="ico/favico.png">
        <link rel="shortcut icon" href="ico/favico.ico">
        <link rel="stylesheet" href="styles/icon.css"/>
        <link rel="stylesheet" href="styles/main.css"/>
		<!-- Google-Code代码高亮CSS -->
        <link rel="stylesheet" href="styles/prettify.css"/>
		<!-- Ueditor编辑器CSS -->
		<link href="styles/umeditor.min.css" type="text/css" rel="stylesheet">
		<script type="text/javascript" src="scripts/cookie_util.js"></script>
		<script type="text/javascript" src="scripts/ue/umeditor.min.js"></script>
		<script type="text/javascript" src="scripts/ue/umeditor.config.js"></script>
		<script type="text/javascript" src="scripts/ue/lang/zh-cn/zh-cn.js"></script>
		<script type="text/javascript" src="scripts/jquery.min.js"></script>
		<script type="text/javascript" src="scripts/notebook.js"></script>
		<script type="text/javascript" src="scripts/note.js"></script>
		<script type="text/javascript" src="scripts/notebody.js"></script>
		<script type="text/javascript" src="scripts/rollback.js"></script>
		<script type="text/javascript" src="scripts/search.js"></script>
		<script type="text/javascript" src="scripts/collect.js"></script>
		<!-- 工具方法 -->
		<script type="text/javascript" src="scripts/tools.js"></script>
		<!-- 事件执行 -->
		<script type="text/javascript">
			//定义全局变量，从Cookie获取userId 
			var userId = getCookie("userId");
			var username = getCookie("username");
			var bookId;
			var noteId;
			var um;
			$(function(){
				$(".profile-username").text(username);
				//实例化Ueditor
				um = UM.getEditor("myEditor");
				//加载分类列表
				loadbooks();
				//加载笔记列表
				$("#books").off("click", "li").on("click", "li", loadnotes);
				//预览笔记
				//$("#notes").off("click", "li").on("click", "li", previewNote);
				//加载笔记内容
				$("#notes,#search_list").off("click", "li").on("click", "li", function(){
					addCheckedCss(this);
					var $li = $(this);
					//noteId = $li.data("noteId");
					loadNoteBody($li);
				});
				//退出时删除Cookie
				$("#logout").unbind("click").click(function(){
					delCookie("userId");
				});
				//类别重命名
				$("#books").off("dblclick", "li").on("dblclick", "li", renameBook);
				
				//关闭操作窗
				$("#can").off("click", ".close,.cancle").on("click", ".close,.cancle", closeWindow);
				//关闭alert弹窗
				$("#can_alert").off("click", "#alert_close").on("click", "#alert_close", closeAlertWindow);
				//添加新类别
				$("#add_notebook").unbind("click").click(addBook);
				//删除类别
				$("#books").off("click", "li .btn_delete").on("click", "li .btn_delete", deleteBook);
				//添加新笔记
				$("#add_note").unbind("click").click(addNote);
				//展示笔记下拉菜单
				$("#notes,#search_list").off("click", ".btn_slide_down").on("click", ".btn_slide_down", showDownMenu);
				//移动笔记
				$("#notes,#search_list").off("click", "li .note_menu .btn_move").on("click", "li .note_menu .btn_move", moveNote);
				//分享笔记
				$("#notes,#search_list").off("click", "li .note_menu .btn_share").on("click", "li .note_menu .btn_share", shareNote);
				//笔记移入回收站
				$("#notes,#search_list").off("click", "li .note_menu .btn_delete").on("click", "li .note_menu .btn_delete", removeNote);
				//回收站
				$("#rollback_button").unbind("click").click(loadRollbackNotes);
				//预览回收站笔记
				$("#rollbacknotes").off("click", "li").on("click", "li", function(){
					addCheckedCss(this);
					noteId = $(this).data("noteId");
				});
				//$("#rollbacknotes").off("click", "li").on("click", "li", previewNote);
				//从回收站恢复
				$("#rollbacknotes").off("click", "li .btn_replay").on("click", "li .btn_replay", replayNote);
				//从回收站删除
				$("#rollbacknotes").off("click", "li .btn_delete").on("click", "li .btn_delete", deleteNote);
				//收藏列表
				$("#like_button").unbind("click").click(loadCollects);
				$("#collects").off("click", "li").on("click", "li", loadCollectBody);
				//删除收藏
				$("#collects").off("click", "li a .btn_delete").on("click", "li a .btn_delete", deleteCollect);
				//后续功能
				$("#action_button").unbind("click").click(function(){
					alertError("功能暂未开通，敬请期待!");
				});
				//搜索
				$("#search_note").unbind("keydown").keydown(function(event){
					var code = event.keyCode;
					if(code == 13){
						$("#pc_part_2").hide();
						$("#pc_part_4").hide();
						$("#pc_part_7").hide();
						$("#pc_part_6").show();
						$("#search_list").empty();
						$("#search_msg").empty();
						$("#page").val("1");
						clearNoteBody();
						searchNotes();
					}
				});
				//搜索更多
				$("#more_note").unbind("click").click(searchNotes);
			});
		</script>
    </head>
    <body class="animated fadeIn">
    	<input id="page" type="hidden" value="1"/>
        <header class="header">
            <div class="header-brand">
                <a data-pjax=".content-body" href="edit.html">
                    <img class="brand-logo" src="images/dummy/8986f28e.stilearn-logo.png" alt="Stilearn Admin Sample Logo">
                </a>
            </div>
            <div class="header-profile">
                <div class="profile-nav">
                    <span class="profile-username"></span>
                    <a  class="dropdown-toggle" data-toggle="dropdown">
                        <span class="fa fa-angle-down"></span>
                    </a>
                    <ul class="dropdown-menu animated flipInX pull-right" role="menu">
                        <li><a href="Change_password.html"><i class="fa fa-user"></i> 修改密码</a></li>
                        <li class="divider"></li>
                        <li><a id="logout" href="log_in.html" ><i class="fa fa-sign-out"></i> 退出登录</a></li>
                    </ul>
                </div>
            </div>
            <form class="form-inline" onsubmit="return false;">
                <button type="button" class="btn btn-default btn-expand-search"><i class="fa fa-search"></i></button>
                <div class="toggle-search">
                    <input type="text" class="form-control" placeholder="搜索笔记" id='search_note'>
                    <button type="button" class="btn btn-default btn-collapse-search"><i class="fa fa-times"></i></button>
                </div>
            </form>
            <ul class="hidden-xs header-menu pull-right">
                <li>
                    <a href="share.html" title="大家的分享">查看分享</a>
                </li>
            </ul>
        </header>
		<div class="row" style='padding:0;' id='center'>
			<!-- alert_background-->
			<div class="opacity_bg" style='display:none' id="opacity_bg"></div>
			<!-- alert_notebook -->
			<div id="can"></div>
			<div id="can_alert" style="z-index=10"></div>
			<div class="col-xs-2" style='padding:0;' id='pc_part_1'>
				<!-- side-right -->
				<div class="pc_top_first">
					<h3>笔记分类</h3>
					<button type="button" class="btn btn-default btn-xs btn_plus" id='add_notebook'><i class="fa fa-plus"></i></button>
				</div>
				<aside class="side-right" id='first_side_right'>
					<div class="module" data-toggle="niceScroll">
						<div class="chat-contact">
							<div class="contact-body">
								<ul class="contacts-list" id="books">
									<!--li class="online">
										<a class='checked'>
											<i class="fa fa-book" title="online" rel="tooltip-bottom"></i> 
											默认笔记本
											<button type="button" class="btn btn-default btn-xs btn_position btn_delete">
												<i class="fa fa-times"></i>
											</button>
										</a>
									</li-->
								</ul>
							</div>
						</div>
					</div>
				</aside>
				<div class="row clear_margin">
					<div class="col-xs-4 click" id='rollback_button' title='回收站'><i class='fa fa-trash-o' style='font-size:20px;line-height:31px;'></i></div>
					<div class="col-xs-4 click" id='like_button' title='收藏笔记本'><i class='fa fa-star' style='font-size:20px;line-height:31px;'></i></div>
					<div class="col-xs-4 click" id='action_button' title='暂未开通'><i class='fa fa-users' style='font-size:20px;line-height:30px;'></i></div>
				</div>
			</div>
			<!-- 全部笔记本 -->
			<!-- 全部笔记 -->
			<div class="col-xs-3" style='padding:0;' id='pc_part_2'>
				<div class="pc_top_second" id='notebookId'>
					<h3>我的笔记</h3>
					<button type="button" class="btn btn-default btn-xs btn_plus" id='add_note'><i class="fa fa-plus"></i></button>
				</div>
				<aside class="side-right" id='second_side_right'>
					<div class="module" data-toggle="niceScroll">
						<div class="chat-contact">
							<div class="contact-body">
								<ul class="contacts-list" id="notes">
									<!--li class="online">
										<a class='checked'>
											<i class="fa fa-file-text-o" title="online" rel="tooltip-bottom"></i> 
											使用Java操作符
											<button type="button" class="btn btn-default btn-xs btn_position btn_slide_down">
												<i class="fa fa-chevron-down"></i>
											</button>
										</a>
										<div class="note_menu" tabindex='-1'>
											<dl>
												<dt>
													<button type="button" class="btn btn-default btn-xs btn_move" title='移动至...'>
														<i class="fa fa-random"></i>
													</button>
												</dt>
												<dt>
													<button type="button" class="btn btn-default btn-xs btn_share" title='分享'>
														<i class="fa fa-sitemap"></i>
													</button>
												</dt>
												<dt>
													<button type="button" class="btn btn-default btn-xs btn_delete" title='删除'>
														<i class="fa fa-times"></i>
													</button>
												</dt>
											</dl>
										</div>
									</li-->
								</ul>
							</div>
						</div>
					</div>
				</aside>
			</div>
			<!-- 全部笔记 -->
			<!-- 回收站笔记 -->
			<div class="col-xs-3" style='padding:0;display:none;' id='pc_part_4'>
				<div class="pc_top_second">
					<h3>回收站笔记</h3>
				</div>
				<aside class="side-right" id='four_side_right'>
					<div class="module" data-toggle="niceScroll">
						<div class="chat-contact">
							<div class="contact-body">
								<ul class="contacts-list" id="rollbacknotes">
									<!--li class="disable">
										<a >
											<i class="fa fa-file-text-o" title="online" rel="tooltip-bottom"></i> 
											虚假回收站笔记
											<button type="button" class="btn btn-default btn-xs btn_position btn_delete">
												<i class="fa fa-times"></i>
											</button>
											<button type="button" class="btn btn-default btn-xs btn_position_2 btn_replay">
												<i class="fa fa-reply"></i>
											</button>
										</a>
									</li-->
								</ul>
							</div>
						</div>
					</div>
				</aside>
			</div>
			<!-- 回收站笔记 -->
			<!-- 搜索笔记列表 -->
			<div class="col-xs-3" style='padding:0;display:none;' id='pc_part_6'>
				<div class="pc_top_second">
					<h3>搜索结果</h3>
				</div>
				<aside class="side-right" id='sixth_side_right'>
					<div class="module" data-toggle="niceScroll">
						<div class="chat-contact">
							<div class="contact-body">
								<ul class="contacts-list" id="search_list">
								</ul>
							</div>
						</div>
						<div id='more_note'>更多...</div>
						<div id="search_msg"></div>
					</div>
				</aside>
			</div>
			<!-- 搜索笔记列表 -->
			<!-- 收藏笔记列表 -->
			<div class="col-xs-3" style='padding:0;display:none;' id='pc_part_7'>
				<div class="pc_top_second">
					<h3>已收藏笔记</h3>
				</div>
				<aside class="side-right" id='seventh_side_right'>
					<div class="module" data-toggle="niceScroll">
						<div class="chat-contact">
							<div class="contact-body">
								<ul class="contacts-list" id="collects">
									<li class="idle">
										<a >
											<i class="fa fa-file-text-o" title="online" rel="tooltip-bottom"></i> 
											switch多分支结构
											<button type="button" class="btn btn-default btn-xs btn_position btn_delete">
												<i class="fa fa-times"></i>
											</button>
										</a>
									</li>
								</ul>
							</div>
						</div>
					</div>
				</aside>
			</div>
			<!-- 收藏笔记列表 -->
			<!-- 参加活动的笔记列表 -->
			<div class="col-xs-3" style='padding:0;display:none;' id='pc_part_8'>
				<div class="pc_top_second">
					<h3>参加活动的笔记</h3>
				</div>
				<aside class="side-right" id='eighth_side_right'>
					<div class="module" data-toggle="niceScroll">
						<div class="chat-contact">
							<div class="contact-body">
								<ul class="contacts-list">
									<li class="offline">
										<a >
											<i class="fa fa-file-text-o" title="online" rel="tooltip-bottom"></i> 
											样式用例（点击无效）
										</a>
									</li>
								</ul>
							</div>
						</div>
					</div>
				</aside>
			</div>
			<!-- 参加活动的笔记列表 -->
			<!-- 编辑笔记 -->
			<div class="col-sm-7" id='pc_part_3'>
				<!-- side-right -->
				<div class="pc_top_third">
					<div class="row">
						<div class="col-xs-9">
							<h3>编辑笔记</h3>
						</div>
						<div class="col-xs-3">
							<button type="button" class="btn btn-block btn-sm btn-primary" id='save_note'>保存笔记</button>
						</div>
					</div>
				</div>
				<aside class="side-right" id='third_side_right'>
					<div class="module" data-toggle="niceScroll">
						<div class="chat-contact">
							<div class="contact-body clear_margin">
								<!-- 笔记标题 -->
								<div class="row" >
									<div class="col-xs-8">
										<input type="text" class="form-control" id="input_note_title" placeholder='笔记标题...'>
									</div>
								</div>
								<!-- 笔记标题 -->
								<div class="row">
									<div class="col-sm-12">
										<!-- 输入框--->
										<script type="text/plain" id="myEditor" style="width:100%;height:400px;">
										</script>
										<!-- 输入框 -->
									</div>
								</div>
							</div>
						</div>
					</div>
				</aside>
			</div>
			<!-- 编辑笔记 -->
			<!-- 预览笔记 -->
			<div class="col-sm-7" id='pc_part_5' style='display:none;' >
				<div class="pc_top_third">
					<div class="row">
						<div class="col-xs-9">
							<h3>预览笔记</h3>
						</div>
					</div>
				</div>
				<aside class="side-right" id='fifth_side_right'>
					<div class="module" data-toggle="niceScroll">
						<div class="chat-contact">
							<div class="contact-body clear_margin">
								<h4 id="noput_note_title"></h4>
								<p>
								</p>
							</div>
						</div>
					</div>
				</aside>
			</div>
			<!-- 预览笔记 -->
		</div>
        <footer>
            <p>版权所有 &copy; 2015-2016 YCU笔记管理系统 应用数学系研发部</p>
			<div style='position:absolute;top:5PX;height:30px;right:20px;line-height:26px;border:1px solid #0E7D76;display:none;background:#fff'>
				<strong style='color:#0E7D76;margin:0 10px;'></strong>
			</div>
        </footer>
		<script type="text/javascript">
			//加载DOM之后处理页面高度
			function get_dom(e){
				return document.getElementById(e);
			}
			function set_height(){
				var pc_height=window.innerHeight;
				pc_height=pc_height-132;
				get_dom('first_side_right').style.height=(pc_height-31)+'px';
				get_dom('second_side_right').style.height=pc_height+'px';
				get_dom('four_side_right').style.height=pc_height+'px';
				get_dom('sixth_side_right').style.height=pc_height+'px';
				get_dom('seventh_side_right').style.height=pc_height+'px';
				get_dom('eighth_side_right').style.height=pc_height+'px';
				get_dom('third_side_right').style.height=(pc_height-15)+'px';
				get_dom('fifth_side_right').style.height=(pc_height-15)+'px';
			}
			function myEditorWidth(){
				var dom=get_dom('third_side_right');
				var style=dom.currentStyle||window.getComputedStyle(dom, null);
				get_dom('myEditor').style.width=style.width;
			}
			set_height();
			//改变窗口大小时调整页面尺寸
			window.onresize=function(){
				set_height();
				var width=$('#third_side_right').width()-35;
				$('.edui-container,.edui-editor-body').width(width);
				$('#myEditor').width(width-20);
			};
		</script>
		<!-- Bootstrap框架JS -->
        <script src="scripts/bootstrap.min.js"></script>
        <script src="scripts/js-prototype.js"></script>       
        <script src="scripts/theme-setup.js"></script>
		<!-- Google-Code代码高亮JS -->
        <script class="re-execute" src="scripts/run_prettify.js"></script>
		<!-- Ueditor编辑器JS -->
		<script type="text/javascript" charset="utf-8" src="scripts/ue/umeditor.config.js"></script>
		<script type="text/javascript" charset="utf-8" src="scripts/ue/umeditor.min.js"></script>
		<script type="text/javascript" src="scripts/ue/lang/zh-cn.js"></script>
		
		<script type="text/javascript">
			//重写JS原生alert函数
				/*window.alert=function(e){
					$('#can').load('./alert/alert_error.html',function(){
						$('#error_info').text(' '+e);
						$('.opacity_bg').show();
					});
				}*/
			//获取笔记本列表
			//get_nb_list();
			//获取特殊笔记本ID
			//get_spnb_list();
			//实例化Ueditor编辑器
			//var um = UM.getEditor('myEditor');
		</script>
		</body>		
</html>